import { Layout, Button, Space, Modal } from 'myselfantd';
import React, { useState } from 'react';
import type { ColumnsType, TableProps } from 'antd/es/table';
import StaticEdit from './StaticEdit';
import StaticAdd from './StaticAdd';
import styles from './index.module.scss';

interface DataType {
  code: number;
  work: string;
  operateArea: number;
  operateDistance: number;
  taskEndTime: string;
  taskStatus: number;
  evaluationState: number;
  option: [];
}
interface Props {
  viewmode?: 'view' | 'add' | 'edit';
  data?: any;
  title?: string;
}
const App: React.FC<Props> = (props) => {
  let { viewmode, data = [] } = props;
  const handleContinue = async (_: any, state: string) => {
    setCurState([true, state]);
  };
  const [curState, setCurState] = useState([false, 'view'] as [boolean, string]);
  return (
    <>
      <Layout.PageContent
        search={false}
        table={{
          template: [
            {
              title: '序号',
              width: 150,
              fixed: 'left',
              align: 'left',
              render: (text, record, index) => {
                return index + 1;
              },
            },
            {
              title: '参数名称',
              width: 150,
              textWrap: 'word-break',
              align: 'left',
              dataIndex: 'attributeName',
            },
            {
              title: '参数值',
              width: 150,
              textWrap: 'word-break',
              align: 'left',
              dataIndex: 'attributeValue',
            },
            // {
            //   title: '参数单位',
            //   width: 120,
            //   textWrap: 'word-break',
            //   ellipsis: true,
            //   align: 'left',
            //   dataIndex: 'categoryPath',
            // },
            // viewmode !== 'view' && {
            //   title: '操作',
            //   width: 240,
            //   render: (_, record) => (
            //     <Space size="middle">
            //       <Button type="link" block onClick={() => handleContinue(_, 'edit')}>
            //         编辑
            //       </Button>
            //       <Button type="link" block onClick={() => handleContinue(_, 'del')}>
            //         删除
            //       </Button>
            //     </Space>
            //   ),
            // },
          ] as ColumnsType<DataType>,
          data: {
            data: data,
            page: { total: data?.length, pageSize: 20, current: 1 },
          },
          attrs: {
            y: 350,
          },
        }}
        // request={requestFn}
      />
      {viewmode !== 'view' && curState[1].includes('edit') && (
        <Modal.Dialog
          showDialog={curState[0]}
          changeDialog={(val: boolean) => setCurState([val, 'view'])}
          size={'middle'}
        >
          {<StaticEdit onFinish={(val: boolean) => setCurState([val, 'edit'])} />}
        </Modal.Dialog>
      )}
      {viewmode !== 'view' && curState[1].includes('add') && (
        <Modal.Dialog
          showDialog={curState[0]}
          changeDialog={(val: boolean) => setCurState([val, 'view'])}
          size={'middle'}
        >
          <StaticAdd onFinish={(val: boolean) => setCurState([val, 'add'])} />
        </Modal.Dialog>
      )}
    </>
  );
};

export default App;
